<template>
    <h2>{{ title }}</h2>
</template>
<script setup>
import { ref, watch } from 'vue';

let title = ref('this is title');
watch(title, (newValue, oldValue) => {
    console.log(`oldValue：${oldValue}`);
    console.log(`newValue：${newValue}`);
});

// 模拟修改操作
setTimeout(() => {
    title.value = '这是一个标题';
}, 2000);
</script>
<!-- <script>
import { ref, watch } from 'vue';

export default {
    setup() {
        let title = ref('this is title');
        watch(title, (newValue, oldValue) => {
            console.log(`oldValue：${oldValue}`);
            console.log(`newValue：${newValue}`);
        });

        // 模拟修改操作
        setTimeout(() => {
            title.value = '这是一个标题';
        }, 2000);
        return {
            title
        }
    }
}
</script> -->